@charset "utf-8";
@import "common";
@import "animate";
body {
    .carousel {
        .carousel-inner {
            .item {
                background-color: #2b80d9;
                img {
                    margin: 0 auto;
                }
            }
        }
    }
    .engine {
        background-color: #fbfaf7;
        >.container {
            background-image: url(../img/homepage/shouji.png);
            background-repeat: no-repeat;
            background-position: 100% calc(100% - 40px);
            padding-bottom: 100px;
            @media (max-width: 768px) {
                background-image: none;
            }
            >.row {
                >h2 {
                    font-size: 48px;
                    line-height: 48px;
                    color: #0078d7;
                    margin-top: 106px;
                    margin-bottom: 33px;
                }
                >p {
                    font-size: 30px;
                    line-height: 30px;
                    color: #666666;
                    margin-bottom: 77px;
                }
                >.col-md-8 {
                    >.eng-content {
                        >.content-item {
                            display: flex;
                            margin-bottom: 46px;
                            >div:first-child {
                                width: 64px;
                                height: 64px;
                                background-color: #0078d7;
                                display: flex;
                                justify-content: center;
                                align-items: center;
                                border-radius: 4px;
                            }
                            >div:last-child {
                                padding-right: 0;
                                >h2 {
                                    font-size: 19px;
                                    line-height: 19px;
                                    margin-top: 4px;
                                }
                                >span {
                                    font-size: 14px;
                                    line-height: 14px;
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    .advantage {
        >.container {
            background-image: url(../img/homepage/youshi.png);
            background-repeat: no-repeat;
            background-position: 0 calc(100% - 95px);
            padding-bottom: 105px;
            @media(max-width: 992px) {
                background-image: none;
            }
            >.row {
                >h2 {
                    font-size: 48px;
                    color: #8fc31f;
                    line-height: 48px;
                    margin-top: 114px;
                    margin-bottom: 44px;
                }
                .at-container {
                    >.ad-box {
                        display: flex;
                        margin-bottom: 16px;
                        .at-left {
                            width: 54px;
                            height: 54px;
                            border-radius: 50%;
                            background-color: #8fc31f;
                            display: flex;
                            justify-content: center;
                            align-items: center;
                        }
                        .at-right {
                            display: flex;
                            align-items: center;
                            padding-left: 10px;
                            >p {
                                margin-bottom: 5px;
                            }
                        }
                    }
                }
            }
        }
    }
    .product {
        background-color: #0079d7;
        >.container {
            padding-bottom: 102px;
            >.row {
                >h2 {
                    color: #fffefe;
                    font-size: 48px;
                    line-height: 48px;
                    margin-top: 112px;
                    margin-bottom: 72px;
                }
                .product-box {
                    >.pd-box {
                        >.row {
                            >.pd-left {
                                margin-bottom: 134px;
                                text-align: center;
                                >img {
                                    margin-top: 7px;
                                }
                            }
                            >.pd-right {
                                >h3 {
                                    font-size: 33px;
                                    color: #fffefe;
                                    margin-bottom: 17px;
                                    margin-top: 0;
                                }
                                >span {
                                    color: #fffefe;
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    .game {
        padding-bottom: 50px;
        >.container {
            >.gm-box {
                .cbt-box {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    margin-top: 86px;
                    margin-bottom: 45px;
                    >h2 {
                        padding-left: 0;
                    }
                    >p {
                        margin-bottom: 0;
                        left: 43.666667%;
                    }
                }
                >.mv-box {
                    >video {
                        width: 100%;
                        height: 200px;
                        object-fit: fill;
                    }
                    @media(max-width: 992px) {
                        text-align: center;
                    }
                }
                >.G-box {
                    >.G-up {
                        >div {
                            text-align: center;
                            >p {
                                text-align: center;
                            }
                        }
                    }
                    >.G-below {
                        >div {
                            text-align: center;
                            >p {
                                text-align: center;
                            }
                        }
                    }
                }
            }
        }
    }
    .partner {
        background-color: #f4f4f4;
        padding-bottom: 64px;
        >.container {
            >.pt-box {
                >.Pbt-box {
                    display: flex;
                    align-items: baseline;
                    margin-top: 40px;
                    margin-bottom: 32px;
                    >span {
                        font-size: 12px;
                        color: #9c9c9c;
                    }
                }
                >.Pimg-box {
                    >.p-up {
                        >div {
                            margin-bottom: 20px;
                            >img {
                                border: 1px solid #dddddd;
                            }
                        }
                    }
                    >.p-below {
                        >div {
                            margin-bottom: 20px;
                            >img {
                                border: 1px solid #dddddd;
                            }
                        }
                    }
                }
            }
        }
    }
}